//
//  GradientView.swift
//  SwiftUIDemo
//
//  Created by zhouzuosong on 2020/10/21.
//  Copyright © 2020 Kael. All rights reserved.
//

import SwiftUI

struct GradientView: View {
    var body: some View {
        VStack {

            Text("渐变色")
            Image("boy")
                .resizable()
                .aspectRatio(contentMode: .fit)
                .clipShape(Circle())
                .overlay(Circle()
                   .stroke(lineWidth: 8)
                   .foregroundColor(.white))
                .frame(width: 40)
            Text("线性渐变色")
                .padding()
                .foregroundColor(.white)
                .cornerRadius(8)
                .background(LinearGradient(gradient: Gradient(colors: [.white, .black]), startPoint: .top, endPoint: .bottom))
            
            Text("斜着的线性渐变")
                .padding()
                .foregroundColor(.white)
                .cornerRadius(8)
                .background(LinearGradient(gradient: Gradient(colors: [.red, .purple]), startPoint: .topLeading, endPoint: .bottomTrailing))
                .cornerRadius(8)
            
            Text("径向渐变")
                .padding(40)
                .foregroundColor(.white)
                .cornerRadius(8)
                .background(
                RadialGradient(gradient: Gradient(
                  colors: [.gray, .red]),
                               center: .center,
                                  startRadius: 2,
                         endRadius: 60))
            
            ZStack {
                AngularGradient(gradient: Gradient(
                                colors: [.green, .blue, .black, .green, .blue, .black, .green]),
                                center: .center)
                                 .edgesIgnoringSafeArea(.all)
                Text("角渐变")
                    .padding()
                    .foregroundColor(.white)
                    .cornerRadius(8)
                    .background(
                    RadialGradient(gradient: Gradient(
                     colors: [.yellow, .red]),
                                  center: .center,
                                     startRadius: 2,
                                 endRadius: 60))
            }
            .frame(width:300, height: 150)
            
            Image("desktop_backgroun")
                .resizable()
                .aspectRatio(contentMode: .fit)
//                .clipShape(Circle())
//                .overlay(Circle()
//                   .stroke(lineWidth: 8)
//                   .foregroundColor(.white))
                .frame(width: 300)
                .blur(radius: 40)
            
            HStack{}
                .frame(maxWidth: .infinity)
            


        }
        .background(Color.gray)
        .frame(maxHeight:.infinity)
    }
}

struct GradientView_Previews: PreviewProvider {
    static var previews: some View {
        GradientView()
    }
}
